<link rel="stylesheet" href="../Public/css/basic.css" type="text/css" />
<link rel="stylesheet" href="../Public/css/galleriffic-2.css" type="text/css" />
<script type="text/javascript" src="../Public/js/jquery-1.3.2.js"></script>
<script type="text/javascript" src="../Public/js/jquery.galleriffic.js"></script>
<script type="text/javascript" src="../Public/js/jquery.opacityrollover.js"></script>
<!-- content -->


<div style="width:100%;height:auto;background:#EEE;min-height:300px;">
  <div class="wind_xgtny">
    <div class="subnav">
    <ul class="crumbs">
        <li>我的位置：</li>
        <li><a href="{$site_url}">{$site_name} </a> </li>
        <li><a href="{$Categorys[$catid]['url']}">&nbsp; &gt; {$Categorys[$catid]['catname']} </a></li>
        <li>&nbsp; &gt; {$title} </li>
        <div class="clear"></div>
    </ul>
 
</div>
    <div class="wind_xgtny_content">
         <!-- 相册部分 -->

        
     <div id="page">
      <div id="container">
        <div id="gallery" class="content">
          <div id="controls" class="controls"></div>
          <div class="slideshow-container" style=" background:#000000">
            <div id="loading" class="loader"></div>
            <div id="slideshow" class="slideshow"></div>
          </div>
        </div>
        <div id="thumbs" class="navigation" style="margin-top: 215px;">
          <ul class="thumbs noscript">
           
            <?php foreach($pics as $k=>$r){?>
                    <li>
                      <a class="thumb" name="leaf" href="<?php echo $r['filepath'] ?>" title="Title #<?php echo $k ?>">
                        <img width="145" height="127" src="<?php echo $r['filepath'] ?>" alt="Title #0" />
                      </a>              
                    </li>
            <?php } ?>
          </ul>
        </div>
        <div style="clear: both;"></div>
        <div style="width:330px;height:auto;float:right;margin-top: -696px;">
          <span style="font-size:20px;display:block;font-weight:bold;line-height:40px;" class="title_aa">{$title}</span>
          <p style="color:#A7A7A7;line-height:20px;">
             {$describe}
          </p>
          <div class="wind_xgtny_contentUL">
            <span style="margin-left:28px;width:144px;">
                         <YP:list name="Label" where="genre=17" id="v" limit="50">
                         <?php echo $itemType == $v['id'] ? $v['title'] : ''; ?>
                         </YP:list>
            </span>
            <span style="width:58px;">
                         <YP:list name="Label" where="genre=21" id="v" limit="50">
                             <?php echo $style == $v['id'] ? $v['title'] : ''; ?>
                         </YP:list>
            
            </span>
          </div>
          <!--<div class="wind_xgtny_contentUL2"  style="margin-top: 30px;">
            <p>
              <span style="font-size: 14px;font-weight: bold;color:#333;">设计理念：</span>
               {$content|str_cut=###,400}
            </p>
             <div class="all" style="display:none">{$content}</div>
             {if strlen($content)>400 }<p><a href="javascript:contentall()">查看全部</a></p>{/if}
          </div>-->
        </div>
      </div>
    </div>

    <script type="text/javascript">
      $(".play").css("display","none");
      jQuery(document).ready(function($) {
        // We only want these styles applied when javascript is enabled
        $('div.navigation').css({'width' : '350px', 'float' : 'right'});
        $('div.content').css('display', 'block');

        // Initially set opacity on thumbs and add
        // additional styling for hover effect on thumbs
        var onMouseOutOpacity = 0.67;
        $('#thumbs ul.thumbs li').opacityrollover({
          mouseOutOpacity:   onMouseOutOpacity,
          mouseOverOpacity:  1.0,
          fadeSpeed:         'fast',
          exemptionSelector: '.selected'
        });
        
        // Initialize Advanced Galleriffic Gallery
        var gallery = $('#thumbs').galleriffic({
          delay:                     2500,
          numThumbs:                 6,
          preloadAhead:              10,
          enableTopPager:            true,
          enableBottomPager:         true,
          maxPagesToShow:            7,
          imageContainerSel:         '#slideshow',
          controlsContainerSel:      '#controls',
          captionContainerSel:       '#caption',
          loadingContainerSel:       '#loading',
          renderSSControls:          true,
          renderNavControls:         true,
          playLinkText:              '',
          pauseLinkText:             '',
          prevLinkText:              '',
          nextLinkText:              '',
          nextPageLinkText:          'Next &rsaquo;',
          prevPageLinkText:          '&lsaquo; Prev',
          enableHistory:             false,
          autoStart:                 false,
          syncTransitions:           true,
          defaultTransitionDuration: 100,
          onSlideChange:             function(prevIndex, nextIndex) {
            // 'this' refers to the gallery, which is an extension of $('#thumbs')
            this.find('ul.thumbs').children()
              .eq(prevIndex).fadeTo('fast', onMouseOutOpacity).end()
              .eq(nextIndex).fadeTo('fast', 1.0);
          },
          onPageTransitionOut:       function(callback) {
            this.fadeTo('fast', 0.0, callback);
          },
          onPageTransitionIn:        function() {
            this.fadeTo('fast', 1.0);
          }
        });
      });
    </script>
    
              
<script type="text/javascript">
	
 $(document).ready(function(){ 
      setTimeout(function(){
		  img_chu();
		},10); 
   	}); 
	
  $(".controls").click(function(){
	  //alert(44);
		  setTimeout(function(){
			  img_chu();
			},201); 
	  });
  $(".thumbs .thumb").click(function(){
	  //alert(44);
		  setTimeout(function(){
			  img_chu();
			},201); 
	  });
  $('.pagination a').live("click",function(){
	setTimeout(function(){
			  img_chu();
			},201);
	
	});	  	  
	
function img_chu(){
	  var width=808;
		var height=690;
		var bili=width/height;
		var img = new Image();
		img.src =$('#slideshow img').attr("src") ;
		var w = img.width;
		var h = img.height;
		var b=w/h;
		var top=0;
		if(height>h){
		 top=(height-h)/2;
		
		} 
		if(width>w){
			left=(width-w)/2;
					//alert(width)
					//alert(w)
			}   
		  
		  if(w<=width && h<=height){
			 // alert(333)
			             
						  $("#slideshow img").css("width",w+'px').css("height",h+'px').css("margin-top",top+'px');
		  }else if(w>width && h>height){ 
					if(b>bili){ 
					     var mar_top=0;
						     mar_top=width/b;
							 top=(height-mar_top)/2;
						 $("#slideshow img").css("width",width+'px').css("height","auto").css("margin-top",top+'px');
						
					}else{
					
						$("#slideshow img").css("width","auto").css("height",height+'px').css("margin-top",top+'px'); 	
					}
		}else if(w>width && h<height){ 
		//alert(33) 
		                     var mar_top=0;
						     mar_top=width/b;
							 top=(height-mar_top)/2;
			 $("#slideshow img").css("width",width+'px').css("height","auto").css("margin-top",top+'px'); 
		}else if(w<width && h>height){ 
		//alert(111)
		  
				//alert(mar_left)
			$("#slideshow img").css("width","auto").css("height",height+'px').css("margin-top",top+'px'); 
		}
	
	
	}	
</script>  
     
        <!-- end -->
        <ul class="wind_xgtnyUL1">
          <li><img src="../Public/images/wind_block1.png" />&nbsp;{$hits}</li>
         
          <div class="hm cl" style="float:left; margin-left:50px;">
   
    <div id="bdshare" class="bdshare_t bds_tools_24 get-codes-bdshare">
    <span  style="text-indent:0;padding-left: 32px; float:left;width: auto;font-size: 16px;font-family: '微软雅黑';">分享到 </span>
    <a class="bds_qzone" title="分享到QQ空间" href="#"></a>
    <a class="bds_tsina" title="分享到新浪微博" href="#"></a>
    <a class="bds_tqq" title="分享到腾讯微博" href="#"></a>
   
    <span class="bds_more" style="text-indent:0;padding-left: 32px;width: auto;font-size: 18px;font-family: '微软雅黑';"></span>
    </div>
    <script type="text/javascript" id="bdshare_js" data="type=tools" src="http://bdimg.share.baidu.com/static/js/bds_s_v2.js?cdnversion=406586"></script>
    </div>
          <li class="wind_public2">
            <a href=""></a>
            <a href=""></a>
            <a href=""></a>
          </li>
           <li style="margin-left:5px; font-size:16px "><a href="javascript:onclick=keep({$id})" >收藏：&nbsp;<img src="../Public/images/windimg24.png" /> </a>&nbsp;&nbsp;<span class="keep_n">{$keep_num}</span></li>
           
        </ul>
        
        <div style="clear:both;"></div>
        <ul class="wind_xgtnyUL2">
          {if  $_COOKIE['YP_username']}<a href="index.php?g=User&m=Index&a=eva_post&like=1&mm=Case&id={$id}">{else}<a href="index.php?g=User&m=Login&a=index">{/if}<li><img src="../Public/images/windimg11.png" /></li></a>
          {if  $_COOKIE['YP_username']}<a href="index.php?g=User&m=Index&a=eva_post&haet=1&mm=Case&id={$id}">{else}<a href="index.php?g=User&m=Login&a=index">{/if}<li><img src="../Public/images/windimg12.png" /></li></a>
          <li class="wind_xgtnyUL2li">
            <span><u >{$like_num}</u></span>
            <span style="margin-left: 29px;"><u>{$haet_num}</u></span>
          </li>
        </ul>
        <div style="clear:both;"></div>
        <div class="wind_border"></div>
<!--评论-->

     <?php 
         $field='jg_comment.id,jg_comment.content,jg_comment.createtime,jg_user.id as userid,jg_user.avatar,jg_user.username';
         $where='jg_Comment.`conid`='.$id.' and contype="Case"';
         $reluts=M('Comment')->field($field)->where($where)->join('jg_user ON jg_comment.userid = jg_user.id')->limit('50')->select();
          foreach($reluts as $key=>$val){
    ?>
        <ul class="wind_xgtnyUL3">
          <li>
            <a href="index.php?m=User&a=index&id={$val['userid']}"><img class="wind_header" src="{$val['avatar']}" /></a>
          </li>
          <li>
            <ul class="wind_xgtnyUL4">
              <li style="width:100%;">
                <span style="font-size:18px;line-height:42px;"><a href="index.php?m=User&a=index&id={$val['userid']}">{$val['username']}</a>&nbsp;&nbsp;</span>
                <span style="color:#999;">{$val.createtime|toDate=###,'Y-m-d H:i:s'}说：</span>
              </li>
                <p>{$val['content']}</p>
            </ul>
          </li>
          <div style="clear:both;"></div>
        </ul>
        <?php } ?>
 <!--评论-->       
       
       <form name="myform" id="myform" action="{:URL('User-Index/comment_post')}" method="post" onSubmit="return logina();">
        <input type="hidden" name="conid" value="{$id}"/> 
        <input type="hidden" name="contype" value="Case"/>
        <input type="hidden"  name="moduleid" value="{$moduleid}" />
        <input type="hidden"  name="catid" value="{$catid}" />
		<input type="hidden"  name="title" value="{$title}" /
		<input type="hidden"  name="lang" value="{$langid}" />
        <input type="hidden"  name="url" value="<?php echo $_SERVER['REQUEST_URI'];?>" />
        <ul class="wind_xgtnyUL3" style="border:none;">
          <li>
            <img class="wind_header" src="../Public/images/windhead1.png" />
          </li>
          <li>
            <ul class="wind_xgtnyUL4">
              <li style="width:100%;">
                <textarea class="wind_textarea"  name="content" placeholder="添加评论~~"></textarea>
              </li>
            </ul>
          </li>
          <div style="clear:both;"></div>
           <input type="submit" value="添加评论" style="cursor: pointer" class="wind_xgtnyULpinl" />
        </ul>
      </form> 
    </div>
  </div>
</div>
<div style="clear:both;"></div>
<script type="text/javascript">
function  keep(id){
	
	
		  var module='Case';
		  
		  var url=window.location.search;
		      url='index.php'+url;
		  var title=$(".title_aa").html();
		 
     
		  //var userid=$("#keep_u").attr('name');
		 // alert(userid)
	
		  $.post(
				  'index.php?g=User&m=Index&a=keep', 
				  {'id':id,
				   'module':module,
				   'url':url,
				   'title':title,
				   'catid':2
				  },
				  function(res){
					 if(res.length>1000){
						 alert('您还未登录，请您先登录');
						 } else{
							 alert(res)
						      if(res=='收藏成功!'){
							  var keepnum=parseInt($(".keep_n").html())+1;
							  $(".keep_n").html(keepnum);
							  }
						 
						 }
					 
					});
	  
	}





</script>